<template>
  <el-menu
    :default-active="current.name"
    background-color="#304156"
    text-color="#eee"
    active-text-color="#4dbcff"
    :collapse="isCollapse"
  >
    <!-- 以后会换成图片 来处理样式问题-->
    <dynamic-menu :menu-list="menu"></dynamic-menu>
  </el-menu>
</template>

<script>
import { mapMutations } from "vuex";
import DynamicMenu from "@/components/DynamicMenu";
export default {
  components: { DynamicMenu },
  computed: {
    isCollapse() {
      return this.$store.state.tab.isCollapse;
    },
    menu() {
      return this.$store.state.tab.menu;
    },
    current() {
      return this.$store.state.tab.currentMenu;
    }
  },
  methods: {
    ...mapMutations({
      close: "closeTab"
    })
  }
};
</script>

<style scoped></style>
